<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MyShop</title>
</head>
<link href="__CSS__/bootstrap.css" rel="stylesheet">
<link href="__CSS__/style.css" rel="stylesheet">
<!--加入bootstrap主题 按钮之类的会显得更加立体感-->
<!--<link href="__CSS__/bootstrap-theme.css" rel="stylesheet">-->
<body>
<!-- 下面div默认class是container 并不能横向占满整个屏幕 用-fluid才可以 -->
<div class="container-fluid">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <nav class="navbar navbar-default" role="navigation">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse"
                            data-target="#bs-example-navbar-collapse-1"><span
                            class="sr-only">Toggle navigation</span><span
                            class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="/">商城</a>
                </div>
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav">
                        <li class="active">
                            <a href="/">主页</a>
                        </li>
                        <li>
                            <!--跳转是跳转到该地址 并不是该界面 由于我定义了该地址为一个路由 所以跳转到那个路由去-->
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">个人中心<strong
                                    class="caret"></strong></a>
                            <ul class="dropdown-menu">
                                <li>
                                    <a href="/myDetail">详情</a>
                                </li>
                                <li>
                                    <a href="/myOrder">订单</a>
                                </li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">商品分类<strong
                                    class="caret"></strong></a>
                            <ul class="dropdown-menu">
                                <li>
                                    <a href="/classify/数码产品">数码产品</a>
                                </li>
                                <li>
                                    <a href="/classify/服装饰品">服装饰品</a>
                                </li>
                                <li>
                                    <a href="/classify/精美图书">精美图书</a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                    <form class="navbar-form navbar-left" role="search" action="/search" method="POST">
                        <div class="form-group">
                            <input class="form-control" type="text" name="message"
                                {if isset($oldMessage)}
                                value={$oldMessage}
                                {else/}
                                value=""
                                {/if}
                            />
                        </div>
                        <button type="submit" class="btn btn-default">搜索</button>
                    </form>
                    <ul class="nav navbar-nav navbar-right">
                        <li>
                            <a href="/register">注册</a>
                        </li>
                        <li>
                            {if session('username')}
                            <a href="/login" class="dropdown-toggle" data-toggle="dropdown">
                                {$Think.session.username}
                                <!--三角箭头-->
                                <strong class="caret"></strong>
                            </a>
                            <ul class="dropdown-menu">
                                <li>
                                    <a href="/logout">退出登录</a>
                                </li>
                            </ul>
                            {else /}
                            <a href="/login">登录</a>
                            {/if}
                        </li>
                    </ul>
                </div>
            </nav>
        </div>
    </div>